<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 
        键盘事件对象
        onkeydown  按下  ---用的多一点
        onkeypress 按下 并松开  -----用的机率很少   功能键不识别 shift  ctrl
        onkeyup  松开键盘  --用的多一点
     -->
    <input type="text" placeholder="按的s键 自动获焦">
    <script>
        //  模拟京东按键输入内容    (按的s键 自动获焦)
        /* 
       1. 键盘事件对象  ---事件绑定到  document.onkeydown     document.onkeyup   用哪一个
        2. e或event     事件对象     属性  e.keyCode   ascII        e.which  ascII 
          e.key   键
        3.搜索框自动获焦  focus()  方法
         */
        // onkeypress 不合适 功能键不认识
        //   document.onkeypress=function(e){
        //     console.log(e);

        //   }

        // onkeydown 不合适 ，字落在框中了

        //   document.onkeydown=function(e){
        //     // console.log(e);  e.keyCode   e.key
        //     // 按下s键输入框自动获焦
        //     console.log(e.keyCode,e.key);
        //     // if(e.keyCode==83){
        //     //     document.querySelector('input').focus();
        //     // }
        //     if(e.key=='s'){
        //         document.querySelector('input').focus();
        //     }

        //   }

        document.onkeyup = function (e) {
            // console.log(e);  e.keyCode   e.key
            // 按下s键输入框自动获焦
            console.log(e.keyCode, e.key);
            // if(e.keyCode==83){
            //     document.querySelector('input').focus();
            // }
            if (e.key == 's') {
                document.querySelector('input').focus();
            }

        }

    </script>
</body>

</html>